<template>
	<a-dropdown trigger="hover">
		<p style="margin-left: 16px; cursor: pointer">{{ SelectInfo(LANGUAGE_TYPE, wsCache.get("lang")) }} <icon-down /></p>
		<template #content>
			<a-doption v-for="item in LANGUAGE_TYPE" :key="item.value" @click="toggleLocale(item.value)">{{ item.label }}</a-doption>
		</template>
	</a-dropdown>
</template>

<script setup lang="ts">
import { useLocaleStore } from "@/store/modules/locale";
import { LANGUAGE_TYPE } from "@/utils/filter";
import { SelectInfo } from "../utils";
import { useCache } from "@/hooks/useCache";
const { wsCache } = useCache();

// 多语言相关
const localeStore = useLocaleStore();
const toggleLocale = (lang) => {
	if(lang === wsCache.get('lang')) return
	localeStore.setCurrentLocale({ lang });
	location.reload();
};

</script>

<style scoped></style>
